﻿@model IList<CategoryModel>
@inject DisplayOrderHomePage order
<div class="product-grid col-12 px-0 order-@order.CategoryFeaturedProducts">
    <div class="form-row">
        @foreach (var item in Model)
        {
            <div class="col-xl-@order.CF_c_Xl col-lg-@order.CF_c_Lg col-md-@order.CF_c_Md col-sm-@order.CF_c_Sm col-@order.CF_c_Col categoryGrid mb-3">
                <a href="@Url.RouteUrl("Collection", new { item.SeName })" title="@item.PictureModel.Title">
                    <article class="card">
                        <b-card-img-lazy src="@item.PictureModel.ImageUrl" alt="@item.PictureModel.AlternateText"></b-card-img-lazy>
                        <div class="card-body">
                            <h4>@item.Name</h4>
                        </div>
                    </article>
                </a>
            </div>
            <div class="col-xl-@order.CF_p_Xl col-lg-@order.CF_p_Lg col-md-@order.CF_p_Md col-sm-@order.CF_p_Sm col-@order.CF_p_Col">
                <div class="form-row flex-grid">
                    @foreach (var product in item.FeaturedProducts)
                    {
                        <div class="col-xl-@order.CF_pp_Xl col-lg-@order.CF_pp_Lg col-md-@order.CF_pp_Md col-sm-@order.CF_pp_Sm col-@order.CF_pp_Col featured-product-container mb-2">
                            <partial name="Partials/CatalogProductView" model="product"/>
                        </div>
                    }
                </div>
            </div>
        }
    </div>
</div>